<template>
    <div class="login">
        <button @click="flag=!flag">切换</button>
        <transition name="fade">
            <p v-if="flag">hello</p>
        </transition>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                flag:false,
            }
        }
    }
</script>

<style lang="scss">
.fade-enter,.fade-leave-to{
    opacity: 0;
}
.fade-enter-active,.fade-leave-active{
    transition:opacity 0.5s;
}
</style>